import { init } from 'snabbdom/build/package/init'
import { h } from 'snabbdom/build/package/h'

import { classModule } from 'snabbdom/build/package/modules/class'
import { styleModule } from 'snabbdom/build/package/modules/style'
import { eventListenersModule } from 'snabbdom/build/package/modules/eventlisteners'
import { attributesModule } from 'snabbdom/build/package/modules/attributes'
import { propsModule } from 'snabbdom/src/package/modules/props'

//使用init()函数创建patch()
//init()的参数是数组，将来可以传入模块，处理属性/样式/事件等
let patch = init([
    classModule,
    styleModule,
    eventListenersModule,
    propsModule
])

//使用h()函数创建vnode 
let vnode = h('div.cls',{
    style:{
        background:'lightblue',padding:'10px'
    },
    class:{
        active:true
    },
    on:{
        click:()=>{
            window.prompt('你好： ')
        }
    },
    hook:{
        init:(vnode)=>{
            console.log('init',vnode)
            vnode.data.style['color'] = '#fff'
        },
        create:()=>{
            console.log(vnode)
        },
        remove:(vnode)=>{
            console.log(vnode)
        }
    }
},[
    h('p','这是一个段落')
])

let oldVnode = document.getElementById('app')

oldVnode = patch(oldVnode,vnode)
